<template>
	<view class="u-demo-block">
		<view class="pagesTop">
			<view style="padding: 40rpx;">
				<view style="display: inline-block;">
					<u-avatar text="昵" fontSize="18" randomBgColor size="50"></u-avatar>
				</view>
				<text style="margin-left: 20rpx;">昵称</text>
			</view>
			<!-- <view class="cellNav">
				<view>
					<u-cell-group :border="false">
						<u-cell title="我的订单" value="查看全部" isLink :titleStyle="topStyle"></u-cell>
					</u-cell-group>
					<u-grid :border="false" col="4">
						<u-grid-item v-for="(listItem,listIndex) in list" :key="listIndex">
							<u-icon :customStyle="{paddingTop:20+'rpx'}" :name="listItem.name" :size="22"></u-icon>
							<text class="grid-text">{{listItem.title}}</text>
							<view class="uBadge">
								<u-badge :isDot="listItem.isDot"></u-badge>
							</view>
						</u-grid-item>
					</u-grid>
					<u-toast ref="uToast" />
				</view>
			</view> -->
			<view class="cellNav">
				<view class="cellCont">
					<u-cell-group :border="false">
						<u-cell icon="account" title="就诊人员" isLink :titleStyle="titleStyle" :url="patientUrl"></u-cell>
						<u-cell icon="map" title="我的地址" isLink :titleStyle="titleStyle" :url="addressUrl"></u-cell>
						<u-cell icon="question-circle" title="关于我们" isLink :titleStyle="titleStyle" :url="aboutUrl"></u-cell>
						<u-cell icon="kefu-ermai" title="联系我们" isLink :titleStyle="titleStyle" :border="false"></u-cell>
					</u-cell-group>
				</view>
			</view>
			<view class="cellNav">
				<view class="cellCont">
					<u-cell-group :border="false">
						<u-cell icon="file-text" title="隐私协议" isLink :titleStyle="titleStyle" :url="privacyUrl"></u-cell>
						<u-cell icon="bookmark" title="服务条款" isLink :titleStyle="titleStyle" :border="false" :url="clauseUrl"></u-cell>
					</u-cell-group>
				</view>
			</view>
			<view class="cellNav cellBotm">
				<u--image :src="require('@/static/my/peihu.png')" width="100%" height="240rpx"></u--image>
				<view class="clickBox">
					<view class="boxTitle">申请成为陪诊员</view>
					<view @click="clickJoin" class="btnClick">立即申请</view>
				</view>
			</view>
			<view>
				<u-button open-type="getPhoneNumber" @getphonenumber="login">微信一键登录</u-button>
			</view>
			<view>
				<u-button @click="loginInfo">登录拿token</u-button>
			</view>
		</view>

		
	</view>
</template>

<script>
	import {
		loginByUsername
	} from '@/api/login';
	export default {
		data() {
			return {
				topStyle: {
					'color': '#606266',
					'font-size': '28rpx',
					'font-weight': 'bold'
				},
				titleStyle: {
					'color': '#606266',
					'font-size': '28rpx'
				},
				// list: [{
				// 		name: 'rmb-circle',
				// 		title: '待付款',
				// 		isDot: true
				// 	},
				// 	{
				// 		name: 'checkmark-circle',
				// 		title: '已付款',
				// 		isDot: false
				// 	},
				// 	{
				// 		name: 'car',
				// 		title: '进行中',
				// 		isDot: false
				// 	},
				// 	{
				// 		name: 'thumb-up',
				// 		title: '待评价',
				// 		isDot: false
				// 	}
				// ],
				patientUrl: "/subpages/pages-my/patient/patientList",
				addressUrl: "/subpages/pages-my/address/addressList",
				aboutUrl:"/subpages/pages-my/about/aboutUs",
				privacyUrl:"/subpages/pages-my/privacy/privacy",
				clauseUrl:"/subpages/pages-my/clause/clause"
			};
		},
		methods: {
			login(e) {
				console.log(e);
			},
			loginInfo() {
				loginByUsername({
					username: 'admin',
					password: '123456'
				})
			},
			clickJoin() {
				uni.navigateTo({
					url:'../../subpages/pages-my/works/works'
				})
			}
		}
	}
</script>

<style lang="scss">
	body {
		background-color: $uni-bg-color-grey;
	}

	.pagesTop {
		width: 100%;
		height: 300rpx;
		background: linear-gradient(to left, $uni-aicloud, $uni-aicloud-gradation);
		font-size: 28rpx;
		color: #ffffff;
	}
	.grid-text {
		font-size: 28rpx;
		color: #606266;
		padding: 10rpx 0 20rpx 0rpx;
		/* #ifndef APP-PLUS */
		box-sizing: border-box;
		/* #endif */
	}
	.cellNav{
		margin:0 20rpx 20rpx 20rpx;
		background: #ffffff;
		border-radius: 10rpx;
		z-index: 1;
	}
	.cellBotm{
		overflow: hidden;
		position: relative;
	}
	.uBadge{
		position: absolute;
		top: 20rpx;
		right: 40rpx;
	}
	.cellCont{
		margin: 0 20rpx;
	}
	.clickBox{
		position: absolute;
		top: 30%;
		left: 3%;
	}
	.boxTitle{
		color: black;
		font-weight: bold;
		font-size: 30rpx;
	}
	.btnClick{
		text-align: center;
		padding:10rpx 20rpx;
		border: 1px $uni-aicloud solid; 
		color: $uni-aicloud;
		background: #ffffff;
		border-radius: 20rpx;
		margin-top: 20rpx;
		opacity: 0.8;
	}
</style>